<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订单详情</title>
    <link rel="stylesheet" href="../layui/css/layui.css"/>
    <script type="text/javascript" src="../layui/layui.js"></script>
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script type="text/javascript" src="../js/context.js"></script>
</head>
<body>
<div class="container">
    <table class="layui-table">
        <colgroup>
            <col width="150">
            <col width="200">
            <col>
        </colgroup>
        <thead>
        <tr>
            <th>菜名</th>
            <th>数量</th>
        </tr>
        </thead>
        <tbody id="tbody">

        </tbody>
    </table>
</div>
<script>
    const orderNum = GetQueryString("orderNum");
    $(function () {
        ajax.post("../orderInfo.do", {
            "orderNum": orderNum
        }, response => {
            $("#tbody").html("");
            response.forEach(function (obj, index) {
                let tr = `<tr>
                <td>${obj.food_name}</td>
                <td>${obj.food_number}</td>
                </tr>`;
                $("#tbody").append(tr);
            });
        });
    });

    function GetQueryString(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");//获取参数值的正则表达式
        var urlKeys = window.location.search.substr(1);//获取url传参中？后面的值：id=123&name=小明
        urlKeys = decodeURI(urlKeys);//针对中文乱码的解决方案；decodeURI()解决乱码问题
        var r = urlKeys.match(reg);
        if (r != null) {
            return r[2];
        } else {
            return null;
        }
    }
</script>
</body>
</html>